#musiclist{
    background: url("/img/bg_list.jpg") fixed;
    background-size: cover;
    vertical-align: top;
    width: 100%;
    /* height: 100%; */
    min-height: 100%;
    color: white;
    /* position: relative;
    z-index: -1; */
}
#musiclist ul{
    padding:5rem 0 7rem 0;
    /* position: absolute;
    z-index: -1;
    width: 100%; */
}
#musiclist .list_item{
    background: rgba(0, 0, 0, 0.4);
    display: flex;
    border-bottom: 0.1rem solid #999;
    justify-content: left;
    font-size: 1.2rem;
    cursor: pointer;
}
#musiclist .list_item .sequence{
    margin-left: 2rem;
    line-height: 4.5rem;
    font-size: 1.5rem;
}
/* #musiclist .details .title{
    font-size: 1.3rem;
    font-weight: bold
}
#musiclist .details{
    margin-left: 2rem;
    margin-top: 0.8rem;
}
#musiclist .selected{
    border-left: 0.4rem solid deepskyblue;
}
#musiclist .singer{
    margin-left: 4rem;
} */

/* 上面是之前的布局，包括歌名，歌手，简介 */
/* 因为API的原因，现在是能包括歌名，歌手了 */

/* <li className="list_item">
    <div className="sequence">1</div>
    <div className="details">
        <p className="title">年轮</p>
        <p className="others">
            <span className="singer">张碧晨</span>-
            <span className="where">三生三世</span>                                
        </p>
    </div>
</li> */
/* 这也是之前的布局，之所以放在这儿是觉得不用占据地方 */



#musiclist .details{
    margin-left: 2.5rem;
    line-height: 4.5rem;
}
#musiclist .details .title{
    font-size: 1.3rem;
    font-weight: bold;
    width: 12rem;
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
#musiclist .singer{
    /* margin-left: 3rem; */
    font-size: 0.8rem;
}
#musiclist .selected{
    border-left: 0.4rem solid deepskyblue;
}
